<table class="table table-hover">
    <thead>
        <tr>
            <th width="5%"><input type="checkbox" class="grid-select-all" /></th>
            <th>编号</th>
            <th>姓名</th>
            <th>邮箱</th>
            <th class="th-nowrap">账号</th>
            <th class="th-nowrap">国家</th>
            <th class="th-nowrap">社媒平台</th>
            <th>粉丝体量</th>
            <th>合作评级</th>
            <th>合作时间</th>
            <th class="th-nowrap">备注</th>
            <th class="th-nowrap">状态</th>
            <th class="th-nowrap">操作</th>
        </tr>
    </thead>
    <tbody>
        @foreach($paginator as $row)
            <tr>
                <td><input type="checkbox" class="grid-row-checkbox" data-id="{{ $row->id }}" /></td>
                <td>{{ $row->kol_code ?? '' }}</td>
                <td>{{ $row->name ?? '' }}</td>
                <td>{{ $row->email ?? '' }}</td>
                <td>{{ $row->media_account ?? '' }}</td>
                <td>{{ $row->country->country ?? '' }}</td>
                <td>{{ \App\Models\KolManage\Kol::$_media_platform[$row->media_platform] ?? '' }}</td>
                <td>{{ \App\Models\KolManage\Kol::$_media_follower[$row->media_follower] ?? '' }}</td>
                <td>{{ \App\Models\KolManage\Kol::$_cooperate_grade[$row->cooperate_grade] ?? '' }}</td>
                <td>{{ $row->cooperate_time ?? '' }}</td>
                <td>{{ $row->remark ?? '' }}</td>
                <td>{{ \App\Models\KolManage\Kol::$_status[$row->status] ?? '' }}</td>
                <td>
                    <a href="/xqc/kol-manage/kol/{{ $row->id }}/edit" class="grid-row-edit">
                        <i class="fa fa-edit"></i>
                    </a>
                </td>
            </tr>
        @endforeach
    </tbody>
</table>
<script language="JavaScript" type="text/javascript">
    $(function () {
        $('.grid-row-checkbox').iCheck({checkboxClass:'icheckbox_minimal-blue'}).on('ifChanged', function () {
            let id = $(this).data('id');
            if (this.checked) {
                $.admin.grid.select(id);
                $(this).closest('tr').css('background-color', '#ffffd5');
            } else {
                $.admin.grid.unselect(id);
                $(this).closest('tr').css('background-color', '');
            }
        }).on('ifClicked', function () {
            let id = $(this).data('id');
            if (this.checked) {
                $.admin.grid.unselect(id);
            } else {
                $.admin.grid.select(id);
            }
        });

        (function () {
            $('.grid-select-all').iCheck({checkboxClass:'icheckbox_minimal-blue'});
            $('.grid-select-all').on('ifChanged', function(event) {
                if (this.checked) {
                    $('.grid-row-checkbox').iCheck('check');
                } else {
                    $('.grid-row-checkbox').iCheck('uncheck');
                }
            }).on('ifClicked', function () {
                if (this.checked) {
                    $.admin.grid.selects = {};
                } else {
                    $('.grid-row-checkbox').each(function () {
                        let id = $(this).data('id');
                        $.admin.grid.select(id);
                    });
                }
            });
        })();
    });
</script>
